<template>
  <div class="ant-descriptions ant-descriptions-bordered">
    <div class="ant-descriptions-title">控制目标</div>
    <div class="ant-descriptions-title small">{{report.targetName}}</div>
    <div class="ant-table ant-table-scroll-position-left ant-table-middle ant-table-bordered">
      <div class="ant-table-content">
        <div class="ant-table-scroll">
          <!---->
          <div class="ant-table-body">
            <table class="">
              <thead class="ant-table-thead">
                <tr>
                  <th key="item" class="" :style="{textAlign: 'center'}">
                    <span class="ant-table-header-column">
                      <div>
                        <span class="ant-table-column-title">项目</span><span class="ant-table-column-sorter"></span>
                      </div>
                    </span>
                  </th>
                  <th class="" key="target" :style="{textAlign: 'center'}">
                    <span class="ant-table-header-column">
                      <div>
                        <span class="ant-table-column-title">控制目标值</span><span class="ant-table-column-sorter"></span>
                      </div>
                    </span>
                  </th>
                </tr>
              </thead>
              <tbody class="ant-table-tbody">
                <tr :class="'ant-table-row ant-table-row-level-'+index" v-for="(item, index) in report.targets" :key="index">
                  <td class="" :style="{textAlign: 'center', width: '50%'}">{{ item.targetName }}</td>
                  <td class="" :style="{textAlign: 'center'}">{{ item.target }}</td>
                </tr>
              </tbody>
            </table>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  name: 'Target',
  props: ['report'],
  data() {
    return {
    }
  },
}
</script>

<style lang="less" scoped>
.ant-descriptions-title.small {
  background-color: #fff;
  padding: 10px;
  text-align: center;
  color: #000;
  border-left: 1px solid #e8e8e8;
  border-right: 1px solid #e8e8e8;
}
</style>